<template>
    <div id="main" style="width: 100%; height: 650px"></div>
</template>

<script>
export default {
  methods: {
    drawChart() {
      var ROOT_PATH =
        "https://cdn.jsdelivr.net/gh/apache/echarts-website@asf-site/examples";

      var chartDom = document.getElementById("main");
      var myChart = this.$echarts.init(chartDom);
      var option;

      option = {
        backgroundColor: "#000",
        globe: {
          baseTexture: ROOT_PATH + "/data-gl/asset/earth.jpg",

          shading: "lambert",

          environment: ROOT_PATH + "/data-gl/asset/starfield.jpg",

          atmosphere: {
            show: true,
          },

          light: {
            ambient: {
              intensity: 0.1,
            },
            main: {
              intensity: 1.5,
            },
          },
        },
        series: [],
      };

      option && myChart.setOption(option);
    },
  },
  mounted() {
    this.drawChart();
  },
};
</script>



<style lang="stylus" scoped></style>